﻿<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>生产派工</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <!--responsive-->
    <link rel="shortcut icon" href="../Content/img/jridge.ico" />
    <link rel="bookmark" href="../Content/img/jridge.ico" />
    <script src="../Scripts/jquery-1.10.2.min.js"></script>
    <script src="../Scripts/clipboard-polyfill.js"></script>
    <!--公共样式-->
    <link rel="stylesheet" href="./content/index.css">
    <!--vue-->
    <script src="../Scripts/vue-2.5.9/vue.min.js"></script>
    <!--axios-->
    <script src="../Scripts/vue-2.5.9/axios.min.js"></script>
    <!--elementUI-->
    <script src="./Scripts/elementUI-2.4.0/index.js"></script>
    <link rel="stylesheet" href="./Scripts/elementUI-2.4.0/theme-chalk/index.css">
    <!--custom-->
    <link rel="stylesheet" href="../Content/vue-common.css">
    <script src="./Scripts/vue-service-school.js"></script>
    <script src="../Scripts/service/vue-service.js"></script>
    <style>
        .viewDrawing {
            background: #f0f9eb;
            cursor: pointer
        }

        .el-form-item {
            padding-bottom: 30px;
        }
    </style>
</head>

<body id="body">
    <div id="app">
        <header-bar :pagename="pagename" :userinfo="userinfo"></header-bar>
        <el-row>
            <el-col :span="3">
                <side-bar></side-bar>
            </el-col>
            <el-col :span="21">
                <div id="container">
                    <!--导航部分-->
                    <el-row style="margin-top:20px;font-size:14px">
                        <el-col :span="10" :offset="1">
                            <span style="font-family:'幼圆'">当前订单：</span>
                            <el-select v-model="selectedOrderID" placeholder="请选择一个订单排产" size="small" @change="selectOrder()">
                                <el-option v-for="item in orderData" :key="item.id" :label="item.properties.name" :value="item.id">
                                    <span style="float: left">{{ item.properties.orderno }}</span>
                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.properties.name }}</span>
                                </el-option>
                            </el-select>
                        </el-col>
                        <el-col :span="12">
                            <span style="float:right;font-size:14px;color:#8492a6;margin:10px auto auto 10px">共计
                                <span style="color:#409EFF">{{assignsheetsLength}}</span> 条可派工单</span>
                        </el-col>
                        <!-- <div style="float: right">
                         <el-pagination background @current-change="handleCurrentChange" :current-page="currentpage" :page-size="everypagenum" layout="total, prev, pager, next "
                                :total="totalnum">
                            </el-pagination> 
                        </div> -->
                    </el-row>
                    <!--正文：派工单-->
                    <el-row>
                        <el-table id="table" :data="assignsheets" style="width: 96%;margin-left:3%" :max-height="mainTable_maxHeight"  :height="mainTable_maxHeight" border v-loading="loading"
                            element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading" element-loading-background="rgba(255, 255, 255, 0.8)"
                            ref="multipleTable" tooltip-effect="dark" @cell-click="cell_click" :cell-class-name="retColor" @selection-change="handleSelectionChange">
                            <!-- <el-table-column type="selection" width="55">
                            </el-table-column> -->
                            <el-table-column type="index" label="序号" width="50" align="center">
                            </el-table-column>
                            <el-table-column label="完成工人" width="120" align="center">
                                <template scope="scope">
                                    <el-select v-model="scope.row.worker">
                                        <el-option v-for="(val,key) in peopleByTeam" :label="val.name" :value="val.id"></el-option>
                                    </el-select>
                                </template>
                            </el-table-column>
                            <el-table-column label="加工设备" width="150" align="center" show-overflow-tooltip>
                                <template scope="scope">
                                    <el-select v-model="scope.row.equipment">
                                        <el-option v-for="(val,key) in devicesByTeam" :label="val.name" :value="val.id"></el-option>
                                    </el-select>
                                </template>
                            </el-table-column>
                            <el-table-column prop="materialno" label="物料编码" sortable width="120" align="center">
                            </el-table-column>
                            <el-table-column prop="identityno" label="图号" sortable width="120" align="center">
                            </el-table-column>
                            <el-table-column prop="plmpartname" label="零件名称" sortable width="120" align="center">
                            </el-table-column>
                            <el-table-column prop="processno" label="工序号" sortable width="100" align="center">
                            </el-table-column>
                            <el-table-column prop="qcpname" label="工序名称" sortable width="120" align="center">
                            </el-table-column>
                            <el-table-column label="开工时间" sortable width="110" align="center">
                                <template scope="scope">
                                    <i class="el-icon-time"></i>
                                    <span style="margin-left: 2px">{{ scope.row.startdate }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column label="完工时间" sortable width="110" align="center">
                                <template scope="scope">
                                    <i class="el-icon-time"></i>
                                    <span style="margin-left: 2px">{{ scope.row.enddate }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column prop="orderquantity" label="数量" style="text-align:center" sortable width="80" align="center">
                            </el-table-column>

                            <el-table-column label="操作" fixed="right" width="100" align="center">
                                <template slot-scope="scope">
                                    <el-button @click="assign(scope.$index,scope.row)" type="success" size="mini" icon="el-icon-bell">派工</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-row>


                    <!--派工对话框-->
                    <el-dialog title="派工" :visible.sync="claimworkDialog" close-on-click-modal="false" close-on-press-escape="false">
                        <el-row>
                            <el-form :inline="true" :model="claimWork" ref="claimWork">
                                <el-form-item label="当前派工数量:">
                                    <span style="margin-left:15px;">{{claimWork.startNumber}}</span>
                                </el-form-item>
                            </el-form>
                        </el-row>
                        <span slot="footer" class="dialog-footer">
                            <el-button @click="claimworkDialog = false">关闭</el-button>
                            <el-button type="primary" :loading="claimworkLoading" @click="release()">确认派工</el-button>
                        </span>
                    </el-dialog>

                </div>
            </el-col>
        </el-row>

    </div>
    <script>
        $('#body').css('height', $(window).height());
        $('#container').css('height', $(window).height() - 80);
    </script>
    <script src="claimwork.js"></script>
    <script src="./Template/vue-components.js"></script>
</body>

</html>